<template>
  <div class="homeWrapper">
    <ul class="ways" ref="ways">
      <li @click="goList(0)">
        <i class="zhimafen"></i>
        <p>芝麻分贷款</p>
      </li>
      <li @click="goList(1)">
        <i class="low"></i>
        <p>超低门槛</p>
      </li>
      <li @click="goList(2)">
        <i class="every"></i>
        <p>黑白户都能贷</p>
      </li>
      <li @click="goList(3)">
        <i class="new"></i>
        <p>每日新口子</p>
      </li>
    </ul>
    <div class="item">
      <div class="kouzi">
        <div class="theme">
          <span class="column"></span><span>最新口子</span>
        </div>
      </div>
      <div class="list">
        <product-list :list="list"></product-list>
      </div>
    </div>

    <div class="item">
      <div class="kouzi">
        <div class="theme">
          <span class="column"></span><span>口子列表</span>
        </div>
      </div>
      <div class="list">
        <product-list :list="list"></product-list>
      </div>
    </div>

     <!-- 底部菜单 -->
    <v-menu ref="menu"></v-menu>

  </div>
</template>

<script type="text/ecmascript-6">
import productList from "@/components/product-list/product-list";
import menu from "@/components/menu/menu";
import data from "./product-list.json";


const SUCCESS = 0;
export default {
  data() {
    return {
      lastestList: [],
      list: []
    };
  },
  created() {
    document.title = "草木贷";
    this.lastestList = data.data.lastestList;
    this.list = data.data.list;
  },
  mounted() {
    this.$refs.menu.current = 0;
  },
  methods: {
    goList(type) {
      this._addEntranceClickTimes(type);
      this.$router.push({
        path: "/way",
        query: { type: type }
      });
    },
    _addEntranceClickTimes(type) {
      api.addEntranceClickTimes(type).then(response => {
        if (response.code == SUCCESS) {
          console.log("click +1!");
        }
      });
    }
  },
  components: {
    "product-list": productList,
    "v-menu": menu
  }
};
</script>

<style lang="less">
@import "./home.less";
</style>

